<script lang="ts">
export default {
  name: "OperateMethodProfile"
}
</script>

<template>
  <el-descriptions
    ref="dataFormRef"
    :column="2"
    :model="dataState.formData"
    border
  >
    <el-descriptions-item label="设备厂商"> {{ dataState.manufacturer }}</el-descriptions-item>

    <el-descriptions-item label="设备型号"> {{ dataState.deviceType }}</el-descriptions-item>

    <el-descriptions-item label="子集名称"> {{ dataState.subsetName }}</el-descriptions-item>

    <el-descriptions-item label="模板类型"> {{ dataState.templateType }}</el-descriptions-item>

    <el-descriptions-item label="模板名称"> {{ dataState.templateName }}</el-descriptions-item>

    <el-descriptions-item label="创建时间"> {{ formatDate(dataState.formData.createTime) }}
    </el-descriptions-item>

    <el-descriptions-item label="更新时间"> {{ formatDate(dataState.formData.updateTime) }}
    </el-descriptions-item>

  </el-descriptions>
</template>

<script lang="ts" setup>

import {onMounted, reactive, ref} from "vue";

import {ElForm} from "element-plus";


import {DeviceModelItem} from "@/api/repo/comp/local/types";
import {formatDate,} from '@/utils/formatter';

const dataFormRef = ref(ElForm); // 属性名必须和元素的ref属性值一致

/**
 * 对外声明接口：父页面可以调用它
 */
defineExpose({initData});

// 数据状态：定义
let dataState = reactive({
  // 类型：create/update
  type: 'create',
  // 标题
  title: '详细信息',
  // 版本ID
  versionId: '',
  // 操作名称
  objectId: '',
  // 表单数据
  formData: {} as DeviceModelItem,
  manufacturer: '',
  deviceType: '',
  subsetName: '',
  templateName: '',
  templateType: '',
});

function initData(entity: any) {
  dataState.formData = entity;

  dataState.manufacturer = entity.manufacturer as string;
  dataState.deviceType = entity.deviceType as string;
  dataState.subsetName = entity.subsetName as string;
  dataState.templateName = entity.templateName as string;
  dataState.templateType = entity.templateType as string;
}

function getHrefParams() {
  let tag = "/repo-comp/cloud/dev-template/version-info?";
  let start = location.href.indexOf(tag);
  if (start === 0) {
    return;
  }
  let params = location.href.substring(start + tag.length);

  let versionTag = 'versionId=';
  let versionStart = params.indexOf(versionTag);
  let objectIdTag = '&objectId=';
  let objectIdStart = params.indexOf(objectIdTag);

  dataState.versionId = params.substring(versionStart + versionTag.length, objectIdStart);
  dataState.objectId = params.substring(objectIdStart + objectIdTag.length);
}

onMounted(() => {
  // 从url上获得key
  getHrefParams();
});

</script>
